<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>尾部组件</title>
  <link rel="stylesheet" href="../../public/css/bootstrap.min.css">
  <script src="../../public/js/jquery-3.4.1.min.js"></script>
  <script src="../../public/js/bootstrap.min.js"></script>
  <style>
    /* 最后部分 */

    * {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    body {
      font-family: '微软雅黑', Arial;
      font-size: 12px !important;
    }

    /* help-guide */
    .help-guide {
      width: 100%;
      min-width: 1200px;
      min-height: 265px;
    }

    .help-model-list {
      text-align: center;
    }

    .help-model img {
      width: 50px;
      height: 50px;
      float: left;
    }

    .help-model {
      width: 1200px;
      margin: 0 auto;
      height: 105px;
    }

    .help-model span {
      font-size: 16px;
      font-weight: 600;
      color: #333333;
      line-height: 50px;
      width: 160px;
      padding-left: 10px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      display: inline-block;
    }

    .help-model div {
      margin-top: 15px;
      margin-bottom: 40px;
      float: left;
      width: 220px;
    }

    /* 页尾内容部分help-details */
    .help-details {
      width: 1200px;
      height: 160px;
      margin: 1px auto;
    }

    .help-details ul {
      float: left;
      margin: 0 60px 10px 60px;
      width: 120px;
      text-align: center;
      list-style: none;
    }

    .help-details ul li {
      line-height: 20px;
      font-size: 14px;
      color: #333333;
    }

    .help-details ul li a {
      color: #8a8a8a;
      text-decoration: none;
    }

    .help-details ul li a:hover {
      color: #CC1F3A
    }

    /* 页尾关于我们 */
    .about-us {
      height: 120px;
      text-align: center;
    }

    .about-us span {
      color: gray;
      margin-left: 8px;
    }

    .about-us a {
      color: gray;
      text-decoration: none;
    }
    .about-us-bar {
      margin: 35px 0 15px 0;
    }

    .about-us-bar span a:hover {
      color: #CC1F3A;
    }
  </style>
</head>

<body>
  <!-- 页尾帮助导航 -->
  <footer class="help-guide">
    <div class="help-model d-flex justify-content-between">
      <div>
        <img src="../../public/img/myfooter/diqiu.png" alt="" class="help-model-list">
        <span>品类丰富&nbsp;&nbsp;全球直供</span>
      </div>
      <div class="help-model-list">
        <img src="../../public/img/myfooter/quanchengyiti.png" alt="">
        <span>一体化通关服务</span>
      </div>
      <div class="help-model-list">
        <img src="../../public/img/myfooter/xianxia.png" alt="">
        <span>线上线下&nbsp;&nbsp;多仓直发</span>
      </div>
      <div class="help-model-list">
        <img src="../../public/img/myfooter/zengzhi.png" alt="">
        <span>正关保障&nbsp;&nbsp;资质齐全</span>
      </div>
      <div class="help-model-list">
        <img src="../../public/img/myfooter/shangjiaruzhu.png" alt="">
        <span style="text-align: center;">商家合作</span>
      </div>
    </div>
    <div class="help-details">
      <ul>
        <li>服务指南</li>
        <li><a href="#">开店指南</a></li>
        <li><a href="#">登录与注册</a></li>
        <li><a href="#">期货商品交易协议</a></li>
        <li><a href="#">现货及预售商品交易协议</a></li>
      </ul>
      <ul>
        <li>支付方式</li>
        <li><a href=""> 在线支付</a></li>
        <li><a href="">转账支付</a></li>
        <li><a href="">信用白条支付</a></li>
      </ul>
      <ul>
        <li>物流配送</li>
        <li><a href="#">客户自提</a></li>
        <li><a href="#">委托代发货</a></li>
        <li><a href="#">国际物流</a></li>
        <li><a href="#">发货与签收</a></li>
      </ul>
      <ul>
        <li>物流配送</li>
        <li><a href="#">客户自提</a></li>
        <li><a href="#">委托代发货</a></li>
        <li><a href="#">国际物流</a></li>
        <li><a href="#">发货与签收</a></li>
      </ul>
      <ul>
        <li>帮助服务</li>
        <li><a href="#">常见问题</a></li>
        <li><a href="#">隐私声明</a></li>
      </ul>
    </div>
  </footer>
  <!-- 页尾关于我们 -->
  <footer class="about-us">
    <!-- 广告部分 -->
    <p class="about-us-bar">
      <span><a href="javascript:;">关于我们</a></span>
      <span>|</span>
      <span><a href="javascript:;">联系我们</a></span>
      <span>|</span>
      <span><a href="javascript:;">合作招商</a></span>
      <span>|</span>
      <span><a href="javascript:;">广告服务</a></span>
      <span>|</span>
      <span><a href="javascript:;">人才招聘</a></span>
    </p>
    <!-- 备案信息 -->
    <p class="record-premit">
      <span>北京市公安局朝阳分局备案号</span>
      <span>京ICP备16009005号</span>
      <span>社会信用代码：91110105352949914C</span>
      <span>食品经营许可证：JY11105160288183</span>
    </p>
    <!-- 电话地址 -->
    <p class="address-tel">
      <a href="../../public/img/myfooter/增值电信业务经营许可证.jpg">增值电信业务经营许可证:京B2-20200260</a>
      <span>|</span>
      <span>北京市通州区马驹桥景盛中街17号顺景总部公元 A1栋</span>
      <span>|</span>
      <span>VIP专线：400 029 6788</span>
      <span>| </span>
      <span>传真：010-56717788</span>
    </p>
    <p class="copy-right text-light">
      &copy;Copyright 2016 易网聚鲜网络科技（北京）有限公司  版权所有
    </p>
  </footer>
</body>

</html>